import React from "react";
import {createRoot} from "react-dom/client"
import {
  createBrowserRouter,
  RouterProvider,
  Link
} from "react-router-dom"
import Home from "./Home";
import ContextIndex from "./components/context/contextIndex";
import NestRouteIndex  from "./components/nestRoute/nestRouteIndex";
import Outer  from "./components/nestRoute/outer";
import Second  from "./components/nestRoute/second";

const router = createBrowserRouter([
  {
    path:"/",
    element:(
      <div>
        <h1>hello world</h1>
        <Link to="/about">ABout us</Link><br />
        <Link to="/context">context</Link><br />
        <Link to="/nest">NestRouteIndex</Link>
      </div>
    ),
  },
  {
    path:"about",
    element:<Home/>
  },
  {
    path:"context",
    element:<ContextIndex/>
  },
  {
    path:"nest",
    element:<NestRouteIndex/>,
    children: [
      {
        path: "outer",
        element:<Outer/>
      },
      {
        path: "second",
        element:<Second/>
      }

    ]
  }
])

createRoot(document.getElementById("root")).render(
  // 添加严格模式，在开始模式下会启用额外的检查和警告
  <React.StrictMode>
    <RouterProvider router={router}/>
  </React.StrictMode>
)